<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" href="./css/login.css" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" integrity="sha512-SfTiTlX6kk+qitfevl/7LibUOeJWlt9rbyDn92a1DqWOw9vWG2MFoays0sgObmWazO5BQPiFucnnEAjpAB+/Sw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
  </head>
  <body>
    <main>
      <div class="title">
        <a href="./index.html" class="link_a">
          <img src="./images/logo.png" alt="" />
        </a>
      </div>
      <form action="">
        <div>公共场所不建议自动登录，以防账号丢失</div>
        <div><input type="text" name="username" placeholder="昵称/邮箱/手机号" /></span></div>
        <div><input type="password" name="password" placeholder="密码" /><span class="fa fa-eye-slash show_"></span></div>
        <button type="submit">登录</button>
        <div>
          <a href="./regesiter.html">免费注册</a>
          <a href="">忘记密码？</a>
        </div>
      </form>
    </main>
    <script>
      // 选择眼睛 显示隐藏
      let show = document.querySelector(".show_")
      // 选择输入框
      // 添加点击事件
      let pwd = document.querySelector("input[name='password']")
      show.addEventListener("click",e=>{
        pwd.type = "text"
      })
    </script>
  </body>
</html>
